<!--
 * @Author: lide1202@hotmail.com
 * @Date: 2021-3-13 11:04:24
 * @Last Modified by:   lide1202@hotmail.com
 * @Last Modified time: 2021-3-13 11:04:24
 !-->
<template>
  <div class="text" :style="styleColor" @click="clicktext">{{ styleColor.text }}</div>
</template>

<script>
import {  decrypt } from '@/utils/AES.js'
export default {
  name: "WidgetText",
  components: {},
  props: {
    value: Object,
    ispreview: Boolean
  },
  data() {
    return {
      options: {},
      optionsData: {}
    };
  },
  computed: {
    transStyle() {
      return this.objToOne(this.options);
    },
    styleColor() {
      return {
        position: this.ispreview ? "absolute" : "static",
        color: this.transStyle.color,
        "font-weight": this.transStyle.fontWeight,
        text: this.transStyle.text,
        "font-size": this.transStyle.fontSize + "px",
        "letter-spacing": this.transStyle.letterSpacing + "em",
        background: this.transStyle.background,
        "text-align": this.transStyle.textAlign,
        width: this.transStyle.width + "px",
        height: this.transStyle.height + "px",
        left: this.transStyle.left + "px",
        top: this.transStyle.top + "px",
        right: this.transStyle.right + "px"
      };
    }
  },
  watch: {
    value: {
      handler(val) {
        
       
        if (val.setup.layerName=='secondTitle') {
          let query = JSON.parse(decrypt(this.$route.query.key))
     
          this.options = {
            ...val,
            setup:{
              ...val.setup,
              text:query.company+' '+val.setup.text
            }
          };
          this.optionsData = val.data;
          this.setOptionsData();
          // this.$store.commit('screenComponents/changeState', this.$route.query.company)
        }else {
          this.options = val;
          this.optionsData = val.data;
          this.setOptionsData();
        }
        
      },
      deep: true
    },
    // $route:{
    //   immediate: true,
    //   handler() {
    
    //     if (this.$route.query.company) {
    //       this.styleColor.text = this.$route.query.company
    //     }
    //   }
    // }
  },
  mounted() 
  {
    
   
    if (this.value.setup.layerName == 'secondTitle') {
      let query = JSON.parse(decrypt(this.$route.query.key))
      this.options = {
        ...this.value,
        setup: {
          ...this.value.setup,
          text: query.company + ' ' + this.value.setup.text
        }
      };
      this.optionsData = this.value.data;
      this.setOptionsData();
      // 把公司名存到仓库中
      // this.$store.commit('screenComponents/changeState', this.$route.query.company)
    } else {
      this.options = this.value;
      this.optionsData = this.value.data;
      this.setOptionsData();
    }
   
  },
  methods: {
    // 点击text
    clicktext(){
      
      if (this.value.setup.layerName=='second') {

        if (this.value.setup.text=='基本档案') {
      
          // this.$router.push({
          //   path: '/visual/thirdView/basicFileView',
          //   query: { company: this.$route.query.company, text: this.value.setup.text }
          // })
        } else if (this.value.setup.text == '执法档案') {

          this.$router.push({
            path: '/visual/thirdView/radarView',
            query: { company: this.$route.query.company, text: this.value.setup.text }
          })
        } else if (this.value.setup.text == '体检档案') {

          this.$router.push({
            path: '/visual/thirdView/recordView',
            query: { company: this.$route.query.company, text: this.value.setup.text }
          })
        } else if (this.value.setup.text == '供应链档案') {

          this.$router.push({
            path: '/visual/thirdView/relationView',
            query: { company: this.$route.query.company, text: this.value.setup.text }
          })
        } else if (this.value.setup.text == '指标展示') {

          // this.$router.push({
          //   path: '/visual/thirdView/indicatorsView',
          //   query: { company: this.$route.query.company, text: this.value.setup.text }
          // })
        } else if (this.value.setup.text == '收付汇档案') {

          this.$router.push({
            path: '/visual/thirdView/sandianView',
            query: { company: this.$route.query.company, text: this.value.setup.text }
          })
        }else {
          return
        }
       
      }else {
        return 
      }
    },
    // 数据解析
    setOptionsData() {
      const optionsData = this.optionsData; // 数据类型 静态 or 动态
      if (optionsData.dataType == "dynamicData") {
        this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
      } else {};
    },
    dynamicDataFn(val, refreshTime) {
      if (!val) return;
      if (this.ispreview) {
        this.getEchartData(val);
        this.flagInter = setInterval(() => {
          this.getEchartData(val);
        }, refreshTime);
      } else {
        this.getEchartData(val);
      }
    },
    getEchartData(val) {

      const data = this.queryEchartsData(val);
      data.then(res => {
        this.styleColor.text = res[0].value;
        this.$forceUpdate();
      });
    }
  }
};
</script>

<style scoped lang="scss">
.text {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
</style>
